
    <div class="container consumHis">
        <header class="header">消费记录</header>
        <div class="page-bd">
            <!-- 加载方式需要和PHP商议 -->
            <!-- <div class="weui-loadmore">
                <i class="weui-loading"></i>
                <span class="weui-loadmore__tips">正在加载</span>
            </div> -->
            <ul id='couponsList'>
                <li class="">
                    <div class="weui-flex js-category">
                        <div class="weui-flex-item">
                            <div class="weui_panel">
                                <div class="weui_panel_bd">
                                    <a href="javascript:void(0);" class="weui_media_box weui_media_appmsg consume_a" >

                                        <div class="weui_media_bd">
                                            <h4 class="weui_media_title hisTitle">
                                                <!-- ****************************************** -->
                                                流水号:<span>
                                                   5433165413213
                                                </span>
                                            </h4>
                                            <h4 class="weui_media_title hisTitle">
                                                <!-- ****************************************** -->
                                                成都新世纪店
                                            </h4>
                                        </div>
                                    </a>
                                </div>
                            </div>
                        </div>
                        <i class="icon icon-74"></i>
                    </div>
                    <div class="page-category js-categoryInner consume_showcontent">

                        <div class="weui_cells consume_list">
                            <div class="weui_cell lcontent_header" >
                                <!-- ************************************************************** -->
                                <div class="weui-flex-item consum_left">
                                    <p>消费时间</p>
                                    <p>2017-07-11</p>
                                </div>
                                <div class="weui-flex-item">
                                    <p>消费金额</p>
                                    <p>34.00</p>
                                </div>
                                <div class="weui-flex-item consum_right" >
                                    <p>消费积分</p>
                                    <p>34</p>
                                </div>
                            </div>

                            <div class="weui_cell lcontent_cell">
                                <div class="consum_left">
                                    <p>《设计师不读书》</p>
                                </div>
                                <div >
                                    <p>x<span>1</span></p>
                                </div>
                                <div >
                                    <p>&yen;<span>34.00</span></p>
                                </div>
                                <div class="consum_right">
                                        <p>正常消费</p>
                                    </div>
                            </div>
                        </div>
                    </div>
                </li>
                <li class="">
                    <div class="weui-flex js-category">
                        <div class="weui-flex-item">
                            <div class="weui_panel">
                                <div class="weui_panel_bd">
                                    <a href="javascript:void(0);" class="weui_media_box weui_media_appmsg consume_a" >

                                        <div class="weui_media_bd">
                                            <h4 class="weui_media_title hisTitle">
                                                <!-- ****************************************** -->
                                                流水号:<span>
                                                   5433165413213
                                                </span>
                                            </h4>
                                            <h4 class="weui_media_title hisTitle">
                                                <!-- ****************************************** -->
                                                成都新世纪店
                                            </h4>
                                        </div>
                                    </a>
                                </div>
                            </div>
                        </div>
                        <i class="icon icon-74"></i>
                    </div>
                    <div class="page-category js-categoryInner consume_showcontent">

                        <div class="weui_cells consume_list">
                            <div class="weui_cell lcontent_header" >
                                <!-- ************************************************************** -->
                                <div class="weui-flex-item consum_left">
                                    <p>消费时间</p>
                                    <p>2017-07-11</p>
                                </div>
                                <div class="weui-flex-item">
                                    <p>消费金额</p>
                                    <p>34.00</p>
                                </div>
                                <div class="weui-flex-item consum_right" >
                                    <p>消费积分</p>
                                    <p>34</p>
                                </div>
                            </div>

                            <div class="weui_cell lcontent_cell">
                                <div class="consum_left">
                                    <p>《设计师不读书》</p>
                                </div>
                                <div >
                                    <p>x<span>1</span></p>
                                </div>
                                <div >
                                    <p>&yen;<span>34.00</span></p>
                                </div>
                                <div class="consum_right">
                                    <p>正常消费</p>
                                </div>
                            </div>
                        </div>
                    </div>
                </li>

            </ul>
        </div>
    </div>
    <script>
        $(function () {
            //点击效果
            $('.page-bd').on('click', '.js-category', function () {
                $parent = $(this).parent('li');
                if ($parent.hasClass('js-show')) {
                    $parent.removeClass('js-show');
                    $(this).children('i').removeClass('icon-35').addClass('icon-74');
                } else {
                    $parent.siblings().removeClass('js-show');
                    $parent.addClass('js-show');
                    $(this).children('i').removeClass('icon-74').addClass('icon-35');
                    $parent.siblings().find('i').removeClass('icon-35').addClass('icon-74');
                }
            });

        });
    </script>